<template>
	<view class="main">

		<view>
			<u-navbar :is-back="true" title="分享" :background="background" :border-bottom="false" title-color="#fff"
				title-size="35rpx" title-bold="true" back-icon-color="#fff">
			</u-navbar>
			<view class="background">
				<image :src="ewm" mode=""></image>
			</view>
			<!-- 	<view class="ewm">
					<image :src="ewm" alt="">
				</view> -->
			<view class="bot">
				<view class="button" @click="down">
					保存二维码
				</view>
			</view>
			<view class="bottom">
				<view>奖励制度：</view>
				<u-parse :html="contents"></u-parse>
			</view>
		</view>
		</x-Longscree>
	</view>
</template>
<script>
	import {
		pathToBase64,
		base64ToPath
	} from '@/static/libs/image-tools.js'
	export default {
		data() {
			return {
				background: {
					backgroundColor: '#000000',
				},
				ewm: '',
				filePath: '',
				link: '',
				contents: '',
				base64: '',
			}
		},
		onShow() {},
		onLoad() {

			this.getgift()
			this.getinfo()
		},
		mounted() {
			this.domId = '#poster'
		},
		methods: {
			getgift() {
				global.$http.request({
					url: '/api/index/content',
					data: {
						content: 'invite_detail'
					}
				}).then(res => {
					console.log(res);
					if (res.data.code == 0) {
						this.contents = res.data.data.content
					}
				})
			},
			getinfo() {
				global.$http.request({
					url: '/api/mine/index',
					data: {
						token: uni.getStorageSync('token')
					}
				}).then(res => {
					if (res.data.code == 0) {
						console.log(res.data.data);
						console.log(res.data.data.invite_link)
						this.link = res.data.data.invite_link
						uni.request({
							url: 'http://yzc.taian0538.cn/api/task/qrcode',
							method: 'GET',
							data: {
								text: this.link
							},
							success: (re) => {
								if (re.statusCode == 200) {
									console.log(re);
									this.ewm = re.data
									console.log(this.ewm);
									this.urlTobase64(this.ewm).then(res => {
										console.log(res)
										this.base64 = res

									})
								}

							}
						})
					}
				})

			},
			// 			//转base64
			// urlTobase64(img) {
			//                 return new Promise((resolve, reject) => {
			//                     wx.downloadFile({
			//                         url: img,
			//                         success(res) {
			//                             wx.getFileSystemManager().readFile({
			//                                 filePath: res.tempFilePath, //选择图片返回的相对路径
			//                                 encoding: 'base64', //编码格式
			//                                 success: res => { //成功的回调
			//                                 // console.log(res.data)
			//                                  // console.log('data:image/png;base64,' + res.data)
			//                                     resolve('data:image/png;base64,' + res.data)
			//                                 }
			//                             })
			//                         }
			//                     })
			//                 })
			//             },
			//
			//下载海报，只在APP内有效
			down() {
				uni.downloadFile({ //下载
					url: this.ewm, //图片下载地址
					success: res => {
						if (res.statusCode === 200) {
							uni.saveImageToPhotosAlbum({ //保存图片到系统相册。
								filePath: res.tempFilePath, //图片文件路径
								success: function() {
									uni.showToast({
										title: '图片保存成功',
										icon: 'none',
									});
								},
								fail: function(e) {
									console.log(e);
									uni.showToast({
										title: '图片保存失败',
										icon: 'none',
									});
								}
							});
						}
					}
				});
			},


		}
	}
</script>

<style lang="scss">
	page {
		background-color: #000000;
		width: 750rpx;
		font-family: PingFang SC-Regular, PingFang SC;

		.main {
			height: 100%;
			width: 750rpx;
			overflow: hidden;

			.background {
				width: 600rpx;
				margin: 0 auto;

				image {
					// position: absolute;
					// top: 0;
					// z-index: -1;
					width: 600rpx;
					height: 1006rpx;
				}
			}

			.ewm {
				position: absolute;
				top: 1005rpx;
				right: 138rpx;
				z-index: 5;

				image {
					width: 112rpx;
					height: 112rpx;

				}
			}

			.bot {
				margin: 60rpx 0 60rpx 0;
				display: flex;
				flex-direction: column;
				align-items: center;

				.button {
					text-align: center;
					line-height: 92rpx;
					width: 320rpx;
					height: 92rpx;
					background: #333333;
					border-radius: 46rpx;
					opacity: 1;
					font-size: 32rpx;
					font-weight: bold;
					color: #F3C860;
				}


			}

			.bottom {

				font-size: 28rpx;
				font-weight: 400;
				color: #FFFFFF;
				line-height: 48rpx;
				padding: 0 76rpx;


			}
		}
	}
</style>
